<template>
  <!-- <cpxm></cpxm> -->
  <el-row class="welbox" :gutter="20">
    <el-col :span="8" :xs="24" :sm="8" class="welLeft">
      <!-- 个人统计信息 -->
      <userCountInfo></userCountInfo>
    </el-col>
    <el-col :span="16" :xs="24" :sm="16">
      <div
        class="boxsty boxBottom"
        v-if="!isLeader"
        style="padding: 10px 30px 20px 30px"
      >
        <el-tabs v-model="activeName" class="syheader">
          <el-tab-pane label="合同待办事项" name="first">
          <!-- <el-tab-pane v-if="!thirdVisible"  label="待办事项" name="first"> -->
            <span slot="label">
              <el-badge :value="dbName" class="item">
                <span>合同待办事项</span>
              </el-badge>
            </span>
            <wodeExamineIndex ref="wodeExamineIndex"></wodeExamineIndex>
          </el-tab-pane>
          <el-tab-pane v-if="!thirdVisible" label="奖金待办事项" name="second">
            <span slot="label">
              <el-badge :value="jjdbName" class="item">
                <span>奖金待办事项</span>
              </el-badge>
            </span>
            <jiangjinToDo ref="jiangjinToDo" @jiangjinTdChild="jiangjinTdChild"></jiangjinToDo>
          </el-tab-pane>
          <el-tab-pane  v-if="thirdVisible" label="奖金待办事项" name="third">
            <span slot="label">
              <el-badge :value="totalPage" class="item">
                <span>奖金待办事项</span>
              </el-badge>
            </span>
            <el-table :data="dataList" border height="300">
              <el-table-column
                label="流程名称"
                prop="lcmc"
                align="center"
                min-width="120px"
              ></el-table-column>
              <el-table-column
                label="当前节点"
                prop="dqjd"
                align="center"
                min-width="120px"
              ></el-table-column>
              <el-table-column
                label="发起人"
                prop="names"
                align="center"
                min-width="120px"
              ></el-table-column>
              <el-table-column
                label="任务数量"
                prop="count"
                align="center"
                min-width="120px"
              ></el-table-column>
              <el-table-column
                label="接收时间"
                prop="times"
                align="center"
                min-width="120px"
              ></el-table-column>
              <el-table-column
                label="操作"
                prop="num"
                align="center"
                min-width="120px"
              >
                <template slot-scope="scope">
                  <el-button type="primary" plain @click="tiaozhuan(scope.row.id,scope.row.tzym)"
                    >审批办理</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
            <div class="avue-crud__pagination">
          <el-pagination
            @size-change="sizeChangeHandle"
            @current-change="currentChangeHandle"
            :current-page="pageIndex"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="pageSize"
            :total="totalPage"
            background
            layout="total, sizes, prev, pager, next, jumper"
          >
          </el-pagination>
        </div>
        </el-tab-pane>
          <el-tab-pane label="测评待办事项" name="fourth">
            <span slot="label">
              <el-badge :value="cpName" class="item">
                <!-- <span>重点任务、专项工作考核</span> -->
                <span>测评待办</span>
                <!-- <span>测评待办事项</span> -->
              </el-badge>
            </span>
            <cepingDcp ref="cepingDcp"></cepingDcp>
          </el-tab-pane>
        </el-tabs>
      </div>
      <div class="boxsty boxBottom" v-else>
        <el-tabs v-model="activeName" class="syheader">
          <el-tab-pane label="合同待办事项" name="first">
            <span slot="label">
              <el-badge :value="dbName" class="item">
                <span>合同待办事项</span>
              </el-badge>
            </span>
            <wodeExamineIndex ref="wodeExamineIndex"></wodeExamineIndex>
          </el-tab-pane>
          <el-tab-pane label="奖金待办事项" name="third">
            <span slot="label">
              <el-badge :value="jjdbName" class="item">
                <span>奖金待办事项</span>
              </el-badge>
            </span>
            <jiangjinToDo ref="jiangjinToDo" @jiangjinTdChild="jiangjinTdChild"></jiangjinToDo>
          </el-tab-pane>
          <el-tab-pane label="测评待办事项" name="second">
            <span slot="label">
              <el-badge :value="cpName" class="item">
                <span>测评待办</span>
                <!-- <span>重点任务、专项工作考核</span> -->
                <!-- <span>测评待办事项</span> -->
              </el-badge>
            </span>
            <cepingDcp ref="cepingDcp"></cepingDcp>
          </el-tab-pane>
        </el-tabs>
      </div>
    </el-col>
    <!-- 快捷入口-->
    <!-- v-if="isLeader" -->
    <el-col
      :span="24"
      style="margin-bottom: 40px; margin-top: 10px"
    >
      <kuaijieRK ref="kuaijieRK"></kuaijieRK>
    </el-col>
   <!--<el-col :span="24" style="margin-bottom: 40px" v-if="!isLeader">
      <div class="boxsty">
        <div class="tabletext titbottom">我的待办审批</div>
        <wodeExamine ref="wodeExamine"></wodeExamine>
      </div>
    </el-col>
      <el-col :span="24" style="margin-bottom: 40px" v-if="!isLeader">
      <div class="boxsty">
        <div class="tabletext titbottom">我的述职报告</div>
        <cepingSzbg ref="cepingSzbg"></cepingSzbg>
      </div>
    </el-col> -->
  </el-row>
</template>

<script>
import cpxm from "@/views/ceping/cepingxmxxb/index";
import wodeExamineIndex from "@/page/welcomeComponents/wodeExamineIndex";
import cepingDcp from "@/page/welcomeComponents/cepingDcp"; //带测评
import cepingSzbg from "@/page/welcomeComponents/cepingSzbg"; //述职报告
import userCountInfo from "@/page/welcomeComponents/userCountInfo"; //个人统计信息
import cepingJieGuo from "@/page/welcomeComponents/cepingJieGuo"; //测评结果
import wodeExamine from "@/page/welcomeComponents/wodeExamine"; //我的审批
import kuaijieRK from "@/page/welcomeComponents/kuaijieRuKou"; //业绩合同
import jiangjinToDo from "@/page/welcomeComponents/jiangjinToDo"; //奖金待办
import hetongTodo from "@/page/welcomeComponents/hetongTodo"; //业绩合同待办
import { wddbpage } from "@/api/workflow/wfywmain";
import { getUserInfo } from "@/api/login";
import { mapGetters } from "vuex";
import { getJiangJinAdminDblist,confirmRole } from "@/api/jiangjin/jiangjinfpjjfpdjb";
import { jjdb } from "@/api/workflow/wfywmain";
import {
  wdHuoDong
} from "@/api/ceping/cepinghdglb";
export default {
  name: "welcome",
  components: {
    cpxm,
    cepingDcp,
    cepingSzbg,
    userCountInfo,
    cepingJieGuo,
    wodeExamine,
    kuaijieRK,
    wodeExamineIndex,
    jiangjinToDo,
    hetongTodo,
  },
  data() {
    return {
      tableData: [],
      roleList: [],
      isLeader: false,
      activeName: "first",
      jiangNum: 0,
      dataList: [],
      dbName: 0,
      jjdbName: 0,
      byjjName: 0,
      thirdVisible: false,
      cpName:0,
      pageIndex: 1,
      pageSize: 10,
      totalPage: 0,
    };
  },
  watch: {},
  computed: {
    ...mapGetters(["userInfo", "isCollapse"]),
  },
  created() {
    this.getRoleList();
    this.getjiang();
    this.getwddbpage();
    this.getjjdb();
    this.confirmRole();
    this.loadData()
  },
  methods: {
    confirmRole() {
      confirmRole().then((response) => {
        if (response.data.data) {
           this.thirdVisible = true;
           this.activeName= "third";
        }else{
          this.thirdVisible = false;
          this.activeName= "first";
        }
        console.log("this.thirdVisible:"+this.thirdVisible)
      })
    },
    loadData() {
      this.dataListLoading = true
      wdHuoDong().then(res => {
       if(res.data.data){
         this.cpName=res.data.data.length
       }
        this.dataListLoading = false
      })
    },
    getjjdb() {
      jjdb(
        Object.assign({
          current: 1,
          size: 10,
        })
      ).then((response) => {
        this.jjdbName =response.data.data.records.length;
      });
    },
    getwddbpage() {
      wddbpage(
        Object.assign({
          current: 1,
          size: 10,
          key:"HE_GZRWS,HE_JXZDRW,HE_JXZXGZ,HE_YJHT,HE_ZDRW,HE_ZXGZ"
        })
      ).then((response) => {
        this.dbName = response.data.data.total;
      });
    },
    //先获取到角色列表
    getRoleList() {
      getUserInfo().then((res) => {
        this.userRole = res.data.data.sysRoleList;
        this.$nextTick(() => {
          this.handleIsLeader();
        });
      });
    },
    //根据角色判断是否是领导
    handleIsLeader() {
      this.userRole.forEach((item) => {
        if (item.roleName.indexOf("领导") != -1) {
          this.isLeader = true;
          if (!this.isCollapse) {
            this.$store.commit("SET_COLLAPSE");
          }
        }
        console.log(this.isLeader)
      });
    },
    vaildRoles(item) {
      item.meta = item.meta || {};
      return item.meta.roles ? item.meta.roles.includes(this.roles) : true;
    },
    tiaozhuan(id,tzym) {
      if(tzym=='jg'){
        this.$router.push({ path: "/jiangjin/jiangjinfpjjfpdjb/jigou" ,query:{id:id}});
      }else{
        this.$router.push({ path: "/jiangjin/jiangjinfpjjfpdjb/renyuan" ,query:{id:id}});
      }

    },
    getjiang() {
      getJiangJinAdminDblist(
        {
          current: this.pageIndex,
          size: this.pageSize,
        }
      ).then((res) => {
        this.dataList=res.data.data.records
        this.totalPage=res.data.data.total
      })
    },
    // 每页数
      sizeChangeHandle(val) {
        this.pageSize = val;
        this.pageIndex = 1;
        this.getjiang();
      },
      // 当前页
      currentChangeHandle(val) {
        this.pageIndex = val;
        this.getjiang();
      },
    jiangjinTdChild(jiangjinTdChild){
      this.getjjdb();
    },
  },
};
</script>
<style>
.syheader .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav-scroll .el-tabs__nav{
  margin-top: 10px;
}
</style>
